<template>
  <div>
    <Section title="基本信息">
      <RowAttribute label="流程名称" :required="true" :span="24" :label-width="labelWidth">
        <a-input />
      </RowAttribute>
      <RowAttribute label="流程标题" :required="true" :span="24" :label-width="labelWidth">
        <FormulaTextAreaConfig
          v-model="flowModel.titleFormula"
          :title.sync="flowModel.titleFormulaText"
          :variable-container-config="variableContainerConfig"
          :formDefinition="formDefinition"/>
      </RowAttribute>
    </Section>
    <Section title="开发配置">

    </Section>
  </div>
</template>
<script>
import {createModelForVue, createProps} from '@/utils';
import {createFormDefinition} from '@comp/hhd/design/FormDesigner/types';
import {defaultModel} from 'h-flow/src/components/flow/typs/flow';
import {FlowModelEditor, Section} from 'h-flow/dist/h-flow.umd';
import RowAttribute from '@comp/hhd/layout/RowAttribute.vue';
import FormulaTextAreaConfig
  from '@comp/hhd/design/FormDesigner/field/comps/form/FieldValueFormulaGroups/configs/FormulaTextAreaConfig.vue';

export default {
  name: 'FormFlowBaseConfig',
  components: {
    FormulaTextAreaConfig,
    FlowModelEditor,
    RowAttribute,
    Section
  },
  model: createModelForVue("flowModel"),
  props: {
    formDefinition: createProps(Object, createFormDefinition),
    flowModel: createProps(Object, defaultModel),
  },
  data() {
    return {
      labelWidth: '120px',
      request: {
        baseURL: 'window._CONFIG.baseProject',
        headers: {
          'X-Access-Token': 'Vue.ls.get(ACCESS_TOKEN)'
        }
      }
    }
  },
  computed: {
    variableContainerConfig() {
      let formIds = [(this.formDefinition.subForms || []).map(i => i.id), this.formDefinition.id].toString();
      return {
        containers: ['formVariable'],
        formDefinition: this.formDefinition,
        formIds
      };
    },
    innerFlowModel: {
      get() {
        return this.flowModel;
      },
      set(v) {
        this.$emit('change', v);
      },
    }
  }
};
</script>